{% extends 'sales/base.html' %}
{% load static %}
{% block breadcrumb %}

<div class="main_container">
  
  <ol class="breadcrumb">
    <li><a href="#">Mails</a></li>
    <li class="active">Create Mail</li>
  </ol>
  
  
  <form id="email_form" action="." method="POST">
    <div class="overview_form_block row marl">
      <div class="col-md-12">
        <div class="panel panel-default">
          <div class="panel-heading">
            Compose email
          </div>
          <div class="panel-content">
            <div class="row marl">
              <div class="col-md-6">
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">From *</label>
                    
                    <input type="email" class="form-control" id="from_email" name="from_email"{% if x %} value="{{x.from_email.value}}" {% endif %} 
                    {% if form.errors %} value="{{request.POST.from_email}}" {% endif %}
                    value="{{em.from_email}}"/>
                  </div>
                  <span class='error'> {{ form.from_email.errors }}</span>
                </div>
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">CC</label>
                    <input type="text" class="form-control" />
                  </div>
                </div>
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">To *</label>
                    <input type="email" class="form-control" id="to_email" name="to_email"
                    {% if x %} value="{{x.to_email.value}}" {% endif %} 
                    {% if form.errors %} value="{{request.POST.to_email}}" {% endif %}
                    value="{{em.to_email}}" />
                  </div>
                  <span class='error'> {{ form.to_email.errors }}</span>
                </div>
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">BCC</label>
                    <input type="text" class="form-control" />
                  </div>
                </div>
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Subject *</label>
                    <input type="text" class="form-control" id="subject" name="subject"
                    {% if x %} value="{{x.subject.value}}" {% endif %} 
                    {% if form.errors %} value="{{request.POST.subject}}" {% endif %}
                    value="{{em.subject}}"/>
                  </div>
                  <span class='error'> {{ form.subject.errors }}</span>
                </div>
              </div>
              <div class="col-md-6">
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Parent</label>
                    <div class="input-group" style="width:100%;">
                      <div class="input-group-btn left-dropdown" style="width:auto;">
                        <select class="form-control">
                          <option>Account</option>
                        </select>
                      </div>
                      <select class="form-control text-filter">
                        <option>Select</option>
                      </select>
                      <div class="input-group-btn">
                        <button type="button" class="btn btn-primary search btn-icon" data-action="search">
                        <span class="glyphicon glyphicon-remove"></span>
                        </button>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Select Template</label>
                    <select class="form-control">
                      <option>1</option>
                    </select>
                  </div>
                </div>
                <div class="filter_col col-md-12">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Message *</label>
                    <textarea class="input form-control" rows="8" name="message" id="message">
                    {% if x %} {{x.message.value}} {% endif %}  {{em.message}}
                    </textarea>
                  </div>
                  <span class='error'> {{ form.message.errors }}</span>
                </div>
              </div>
            </div>
            <br clear="all">
          </div>
        </div>
      </div>
      <br clear="all">
    </div>
    
    <div class="row marl buttons_row text-center">
      <div id="extra_hide">
        <button class="btn btn-default save" type="submit">Send</button>
        <a href="/emails/email_draft/"><button class="btn btn-default" name="email_draft" value="draft" type="submit">Save As Draft</button></a>
      </div>
      <div id="seperated_one">
        <a href="/emails/list/"><button class="btn btn-default" type="button">Cancel</button></a>
      </div>
    </div>
</div>
</form>

</div>
{% endblock %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script>

<script src="http://cdn.ckeditor.com/4.5.4/basic/ckeditor.js"></script>
<script type="text/javascript">
  CKEDITOR.replace( 'job_description',
  {
  
  // skin : 'office2003',
  uiColor: '#ffffff',
    height: 120
  //width: 700,
  }
  
  );
  
  // CKEDITOR.replace('description', {
  //   customConfig: "{% static 'js/custom/ckeditor_config.js' %}"
  // });
</script>
{% block js_block %}
<script type="text/javascript">
  {% if x %}
  $("#extra_hide").hide();
  {% endif %}
</script>
{% endblock js_block %}
</body>
</html>